<template>
    <div class="updateForm">
        <el-tabs type="border-card" class="border-card">
                    
                    <el-tab-pane label="基本信息">
                        <baseinfo :zoneId="zoneId" :formDatas="formData"/>
                    </el-tab-pane>
                    <el-tab-pane label="方法设计">
                        <methoddesign :zoneId="zoneId" />
                    </el-tab-pane>
                    <el-tab-pane label="历史信息">
                        <historyinfo :zoneId="zoneId" :projectId="projectId" />
                    </el-tab-pane>
                    <el-tab-pane label="相关文件">
                        <uploadfile/>
                    </el-tab-pane>
        </el-tabs>
    </div>
</template>
<script>
import { getProZone} from "@/api/project/project";
export default {
    name: 'zoneDetail',
    components: { 
                baseinfo:() => import('./children/baseInfo'),
                methoddesign:() => import('./children/methodDesign'),
                historyinfo:() => import('./children/historyInfo'),
                uploadfile:() => import('./children/uploadFile'),
        },
    data() {
        return {
            zoneId:undefined,
            projectId:undefined,
            formData:undefined
        };
    },
    created() {
        this.zoneId= this.$route.params.ID;
        this.getZoneInfo()
    },
    methods: {
        //获取分区信息
        getZoneInfo(){
            getProZone(this.zoneId).then(response => {
                this.formData = response.data;
                this.projectId = response.data.projectId
            });
        },
    }
};
</script>

<style lang="scss" scoped>
.border-card{
    -webkit-box-shadow: 0 0 0 0 #D9D9D9;
    box-shadow: 0 0 0 0 #D9D9D9;
}
.updateForm{
    padding: 20px;
}
</style>